/*.navbar-brand{*/
/*background-image: url(../image/v2-2d45613b0fb8cdd36f53c3b31d0c6ee8_hd.jpg);*/
/*width: 50px;*/
/*background-size: 75%;*/
/*background-repeat:no-repeat;*/
/*background-position: center, center;*/
/*}*/
/*.navbar-brand{*/
/*background-color: black;*/
/*border-radius: 5px;*/
/*}*/

/*.list-group-item .side-bar{*/
/*background-color: #2a6496;*/
/*border-radius: 0px;*/
/*}*/
body {
    background: url("../img/background03.jpg") no-repeat;
}
a:hover {
    color: rgba(79,168,255,0.95) !important;
}
.name {
    height: 80px;
    margin-top: 16px;
    padding-left: 10px;
}
.tit {
    font-family: '可爱得可爱';
    background-color: transparent;
    color: white;
    text-shadow: 3px 3px 3px #fff;
}
#ti {
    animation: change 6s infinite linear;
}
@keyframes change{
    0%{ margin-left: 0px;}
    10%{ color: #64F081;}
    15%{ color: #E8FF3F;}
    20%{ color: aqua;}
    25%{ color: fuchsia;}
    30%{ color: #DADF31;}
    35%{ color: aqua;}
    40%{ color: blueviolet;}
    45%{ color: aqua;}
    50%{ color: #31F566;}
    60%{ color: coral;}
    65%{ color: aqua;}
    70%{ color: #FC9EC1;}
    75%{ color: #742829;}
    80%{ color: fuchsia;}
    85%{ color: #E8FF3F;}
    90%{ color: #037B6A;}
    100%{ color: #DB00CC;}
}
#hi {
    animation: change 2s infinite linear;
}
@keyframes change{
    0%{ margin-left: 0px;}
    10%{ color: #64F081;}
    15%{ color: #E8FF3F;}
    20%{ color: #E79CCF;}
    25%{ color: fuchsia;}
    30%{ color: #DADF31;}
    35%{ color: red;}
    40%{ color: blueviolet;}
    45%{ color: #DB00CC;}
    50%{ color: #31F566;}
    60%{ color: coral;}
    65%{ color: #a71d2a;}
    70%{ color: #FC9EC1;}
    75%{ color: #742829;}
    80%{ color: fuchsia;}
    85%{ color: #E8FF3F;}
    90%{ color: #037B6A;}
    100%{ color: #DB00CC;}
}

.navbar-list-father {
    background-color: rgba(79,168,255,0.65);
}
.navbar-list {
    background-color: rgba(79,168,255,0) !important;
    height: 4em;
    line-height: 3em;
}
.navbar-list li {
    width: 5em;
    text-align: center;
}
.navbar-list li:hover{
    height: 100%;
    color: #555;
    background-color: #e7e7e7;
}
.navbar-right li:active{
    height: 100%;
    color: #555;
    background-color: #e7e7e7;
}

.side-bar .list-group-item {
    border: 0;
    margin-bottom: 5px;
    border-radius: 5px;
}

.side-bar .list-group-item .active {
    background-color: #337ab7;
}

a:hover{
    text-decoration: none;
}

img{
    display: block;
    max-width: 100%;
    border-radius: 5px;
}

.avatar{
    display: inline-block;
}

.avatar img{
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: 3px;
}

.blog-list-item{
    padding-bottom: 15px;
    padding-top: 15px;
    border-bottom: 1px solid #adadad;
}

.blog-list-item:last-child{
    border-bottom: 0;
}

.blog-list-item:first-child{
    padding-top: 0;
}

.blog-list-item .title{
    display: block;
    font-size: 18px;
    font-weight: bold;
    line-height: 2;
    margin-bottom: 15px;
    color: black;
}

.blog-list-item .title:hover {
    color: #9d9d9d;
}

.blog-list-item .info{
    color: #9d9d9d;
    margin-top: 5px;
    cursor: pointer;
}

.side-bar-card{
    background: rgba(0,0,0,.06);
    padding: 15px 0;
    border-radius: 5px;
}

.side-bar-card .side-bar-introduction{
    padding-left: 5px;
    line-height: 1.8;
    color: #9d9d9d;
    font-size: 15px;

}

.side-bar-card .side-bar-phone{
    line-height: 1.5;
    font-size: 13px;
}

.side-bar-recommend{
    margin-top: 10px;
}

.side-bar-card .side-bar-title{
    padding-left: 15px;
    padding-bottom: 15px;
}

.side-bar-recommend .side-bar-list .side-bar-item{
    padding: 15px 15px;
}

.side-bar-recommend .side-bar-list .side-bar-item:hover{
    padding: 15px 15px;
    background-color: rgba(0,0,0, .09);
}

.side-bar-recommend .side-bar-list .side-item-title{
    color: black;
}

.side-bar-recommend .side-bar-list .side-item-title:hover{
    color: #9d9d9d;
}


.side-bar-recommend .side-bar-list .side-item-info{
    color: #9d9d9d;
    font-size: 12px;
}


/*博客补充css*/
.blog-title{
    font-size: 30px;
    line-height: 1.5;
    font-weight: bold;
}

.blog-info{
    line-height: 1.8;
    color: #9d9d9d;
    font-size: 15px;
}
/*标签内部垂直居中*/
/*https://blog.csdn.net/DreamFJ/article/details/68921957*/
.blog-info .label,
.blog-info img {
}

.blog-info .label{
    opacity: 0.8;
}

.blog-content{
    padding-top: 15px;
    font-size: 15px;
    line-height: 1.5;
}

.blog-content img{
    margin: 15px auto;
}

.modal-footer{
    margin-top: 30px;
}

/*移动端自适应*/
#toggle-checkbox:checked ~ div{
    display: block !important;
}

.toggle-label{
    display: inline-block;
    position: absolute;
    right: 15px;
    top: 15px;
    font-size: 15px;
    font-weight: normal;
    color: #777;
}

.toggle-label:hover{
    color: #333;
}
details {
    margin-top: -1em;
}
.info_ {
    /*float: right;*/
}
@media all and (max-width: 576px) {
    .info- {
        /*display: none;*/
        /*float: right;*/
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        text-overflow: ellipsis;
        overflow: hidden;
    }
    .info_ {
        position: absolute;
        float: right;
    }
}
.tx{
    width: 60px; height: 60px;
    vertical-align:middle;
    margin-top: 12px;
    margin-right: 6px;
    float: right;
    display: inline-block;
    /*position: absolute;*/
    border-radius: 999px;
    border: #FFFFFF 4px solid;
    box-shadow:#E79CCF 3px 1px 0px;
    z-index: 99999999;
}
.tx:hover {
    border-radius: 0px;
    width: 66px;
    height: 66px;
    transition: .5s;
}
.footer {
    width: 100%;
    text-align: center;
}
.footer-info {
    width: 100%;
    text-align: center;
}
.info- span{
    float: right;
    cursor: pointer;
    margin-top: 25px;
    margin-right: 0;
}
.navbar-top li {
    cursor: pointer;
    width: 5em;
}
.hi-up {
    background-color: rgba(79,168,255,0.65) !important;
}

.bowen {
    border: rgba(174,220,129,0.21) 1px solid;
    border-radius: 8px;
    padding-top: 15px;
    padding-left: 15px;
    margin-bottom: 10px;
}
.bowen:hover {
    border: rgba(79,168,255,0.65) 1px solid;
}
/*works-css*/
.works img {
    width: 30%;
    height: 30%;
}
.text {
    text-align: center;
}